import React from "react";
import { withRouter } from "react-router";
import { NavLink } from "react-router-dom";

import styled from "styled-components";
import { Layout, Menu } from "antd";
import IconFont from "../components/iconfont";
const { Sider } = Layout;

const Logo = styled("div")`
  height: 32px;
  background: rgba(255, 255, 255, 0.2);
  margin: 16px;
`;

@withRouter
export default class SiderMenu extends React.PureComponent {
  render() {
    return (
      <Sider width={80}>
        <Logo />
        <Menu theme="dark" defaultSelectedKeys={["1"]} mode="inline">
          <Menu.Item key="1" style={{ textAlign: "center" }}>
            <NavLink to="/">
              <IconFont type="icon-tubiao115" />
            </NavLink>
          </Menu.Item>
        </Menu>
      </Sider>
    );
  }
}
